<template>
	<view>
		<!-- 顶部自定义导航 -->
		<tn-nav-bar fixed :isBack="false" :bottomShadow="false" backgroundColor="#FFFFFF">
			<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
				<!-- 返回按钮 -->
				<view class="custom-nav__back" @tap="toPageName('index')">
					<view class="logo-pic tn-shadow-blur" style="background-image: url('/static/logo.png')">
						<view class="logo-image"></view>
					</view>
					<view class="tn-icon-left"></view>
				</view>
				<!-- 搜索框 -->
				<view class="custom-nav__search tn-flex tn-flex-col-center tn-flex-row-center">
					<view class="custom-nav__search__box tn-flex tn-flex-col-center tn-flex-row-left tn-color-gray--dark tn-bg-gray--light">
						<view class="custom-nav__search__icon tn-icon-search"></view>
						<tn-input style="" v-model="searchText" />
					</view>
				</view>
			</view>
		</tn-nav-bar>
		<!-- 顶部导航距离 -->
		<view class="" :style="{ paddingTop: vuex_custom_bar_height + 'px' }" />
		查找
	</view>
</template>

<script>
import util_mixin from "../../libs/mixin/util_mixin";

export default {
	mixins: [util_mixin],
	data() {
		return {
			searchText: "",
		};
	},
};
</script>

<style lang="scss" scoped>
/* 自定义导航栏内容 start */
.custom-nav {
	height: 100%;

	&__back {
		margin: auto 5rpx;
		font-size: 40rpx;
		margin-right: 10rpx;
		margin-left: 30rpx;
		flex-basis: 5%;
	}

	&__search {
		flex-basis: 60%;
		width: 100%;
		height: 100%;

		&__box {
			width: 100%;
			height: 70%;
			padding: 10rpx 0;
			margin: 0 30rpx;
			border-radius: 60rpx;
			font-size: 24rpx;
			background-color: rgba(255, 255, 255, 0.2);
		}

		&__icon {
			padding-right: 10rpx;
			margin-left: 20rpx;
			font-size: 30rpx;
		}

		&__text {
		}
	}
}
</style>
